<html ng-app="arduinoControl">
	<script src="angular.js"></script>
	<script src="arduino.js"></script>
	<script src="ui-bootstrap-0.2.0.js"></script>
	<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet"/>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Arduino Remote Control</title>
	</head>
	<body>
		<tabs>
			<pane heading="Manual Control" >
				<div ng-controller="ManualCtrl">
					<form ng-submit="sendData()">
						<h1>Manual Control</h1>
						<input type="text" ng-model="rawData" placeholder="type data to send" />
						<input type="submit" value="OK" />
					</form>
				</div>
			</pane>
			<pane heading="Sound">
				<div ng-controller="SoundCtrl">
					<img src="soundremote.jpg" usemap="#soundmap"/>
					<map id="soundmap" name="soundmap" >
						<area shape="rect" alt="Power" title="" coords="80,126,139,187" href="#" ng-click="Power()" />
						<area shape="rect" alt="Input" title="" coords="155,130,219,188" href="#" ng-click="Input()" />
						<area shape="rect" alt="Mute" title="" coords="235,125,298,188" href="#" ng-click="Mute()" />
						<area shape="rect" alt="Plus" title="" coords="218,249,291,345" href="#" ng-click="Plus()" />
						<area shape="rect" alt="Minus" title="" coords="69,248,162,346" href="#" ng-click="Minus()" />
						<area shape="rect" alt="Level" title="" coords="139,217,231,266" href="#" ng-click="Level()" />
						<area shape="rect" alt="Effect" title="" coords="141,327,247,385" href="#" ng-click="Effect()" />
					</map>
				</div>
			</pane>
			<pane heading="TV">
				<div ng-controller="TelevisionCtrl">
				</div>
			</pane>
			<pane heading="Lights">
				<div ng-controller="LightsCtrl"></div>
			</pane>
			<pane heading="Heat">
				<div ng-controller="HeatCtrl"></div>
			</pane>
			<pane heading="Misc">
				<div ng-controller="MiscCtrl"></div>
			</pane>
		</tabs>
	</body>
</html>
